import { LocationTag } from './constants';
import { get_svg_icon } from './svg-icon';
import type { IMarkerBuilder, IPlace } from './types';

const o: IMarkerBuilder = (i: IPlace) => {
  return {
    icon: get_svg_icon(i.tag),
    labelClass: 'gmap-marker-label',
    labelContent: [
      "<div class='flex flex-col gap-1 justify-center items-center'>",
      `<p class='font-medium text-text-content-medium'>From</p>`,
      `<p class='font-medium text-text-cta-tonal'>${i.city || ''}</p>`,
      '</div>',
    ].join(''),
  };
};

const d: IMarkerBuilder = (i: IPlace) => {
  return {
    icon: get_svg_icon(i.tag),
    labelClass: 'gmap-marker-label',
    labelContent: [
      "<div class='flex flex-col gap-1 justify-center items-center'>",
      `<p class='font-medium text-text-content-medium'>To</p>`,
      `<p class='font-medium text-text-cta-tonal'>${i.city || ''}</p>`,
      '</div>',
    ].join(''),
  };
};

const build_marker: IMarkerBuilder = (i: IPlace) => {
  const builders: Record<string, IMarkerBuilder> = {
    [LocationTag.Origin]: o,
    [LocationTag.Destination]: d,
  };

  const fn = builders[i.tag];
  if (fn) {
    return fn(i);
  }

  return {
    icon: get_svg_icon(i.tag),
    labelClass: 'gmap-marker-label',
    labelContent: '',
  };
};

export { build_marker };
export type { IMarkerBuilder };
